<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>修改用户</title>
<style type="text/css">
*{
      margan:0px;
	  padding:0px;
}
.title{
      padding:0 80px 0 20px;
      height:42px;
      line-height:42px;
      border-botton:1px solid #eee;
      font-size:14px;
      color:#333;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
      background-color:#F8F8F8;
      border-radius:2px 2px 0 0;
}
u1{
      list-style:none;
}
#form{
      padding:15px;
}
.label_name{
      width:100px;
      float:left;
      text-align:right;
      font-size:14px;
      height:36px;
      line-height:36px;
}
.cont_style{
      float:left;
      width:600px;
      position:relative;
      height:36px;
}
.cont_style select{
      display:block;
      width:220px;
      margin-left:10px;
      padding:4px 6px;
      height:36px;
      border-radius:0;
      -webkit-box-shadow:none!important;
      box-shadow:none!important;
      color:#858585;
      background-color:#fff;
      border:1px solid #d5d5d5;
}
li{
      height:36px;
	  line-height:36px;
	  margin:10px 0px;
}
.cont_style input{
      border-radius:0!important;
	  color:#858585;
	  background-colot:#fff;
	  border:1px solid #d5d5d5;
	  padding:5px 4px;
	  margin-left:10px;
	  line-height:1.2;
	  font-size:14px;
	  font-family:KaiTi;
	  -webkit-box-shadow:none!important;
	  box-shadow:none!important;
	  -webkit-transparent-duration: .1s;
	  transparent-duration: .1s;
}
.resizebox{
      width:600px;
	  height:300px;
      border:1px solid #333;
	  float:left;
	  margin-left:10px;
	  padding:15px;
}
#uimage{
      display:block;
	  
}
.btn{
	  height:36px;
	  line-height:36px;
	  margan:0 6px;
	  padding:0 15px;
	  border:1px solid #dedede;
	  border-radius:2px;
	  font-weight:400;
	  cursor:pointer;
	  text-decoration:none;
	  border-color:#4898d5;
	  background-color:#2e8ded;
	  color:#fff;
}
</style>
<script type="text/javascript" src="js/jquery-3.1.1.js"></script>
<script type="text/javascript">
   $(document).ready(function(){
    $('#uimage').change(function(e){
	 var _URL = window.URL || window.webkitURL;
	 var file,img;
	 if((file = this.files[0])){
	  img = new Image();
	  img.onload = function(){
	   $('#userImage').attr('src',this.src);
	   console.log(this.width)
	  };
	  img.src = _URL.createObjectURL(file);
	 }
	});	
	$.get("selectUser.do",function(user){
	 $("#from-field-select-1").val(user.urole);
	 $("#userImage").attr("src", user.uimage);
	 $("#username").val(user.username);
	 $("#password").val(user.password);
	 $("#uname").val(user.uname);
	 $("#utel").val(user.utel);
	 $("#uid").val(user.uid);
	});
   });
</script>
</head>
<body>
<h1 class="title">修改用户</h1>
<form action="addUser.do" method="post" id="form" enctype="multipart/form-data">
 <input type="hidden" name="uid" id="uid"/>
<ul>
 <li>
  <label class="label_name">请选择角色:</label>
   <span class="cont_style">
    <select class="from-control" id="from-field-select-1" name="urole">
      <option value="">选择分类</option>
      <option value="管理员">管理员</option>
      <option value="用户">用户</option>
      <option value="商家">商家</option>
    </select>
   </span>
 </li>
 <li>
  <label class="label_name">用户名:</label>
   <span class="cont_style">
      <input type="text" name="username" id="username" placeholder="请输入用户名："/>
   </span>
 </li>
 <li>
  <label class="label_name">密码:</label>
   <span class="cont_style">
      <input type="text" name="password" id="password" placeholder="请输入密码："/>
   </span>
 </li>
 <li>
  <label class="label_name">昵称:</label>
   <span class="cont_style">
      <input type="text" name="uname" id="umane" placeholder="请输入昵称："/>
   </span>
 </li>
 <li>
  <label class="label_name">联系方式:</label>
   <span class="cont_style">
      <input type="text" name="utel" id="utel" placeholder="请输入电话号码："/>
   </span>
 </li>
 <li style="height:340px;">
  <label class="label_name">头像:</label>
   <div class="resizebox">
      <img src="image.png" id="userImage"/>
      <input type="file" name="img" id="uimage"/>
   </div>
 </li>
 <li>
       <label class="label_name"></label>
   <span class="cont_style">
	   <button type="subimt" class="btn">添加</button>
	   <button type="button" class="btn">取消</button>
   </span>
 </li>
</ul>
</form>
</body>
</html>